import http from "../libs/http";

import Main from "@/components/main";
import parentView from "@/components/parent-view";
import page404 from "@/view/error-page/404.vue";

export default class uiTool {
  static setRem() {
    let whdef = 100 / 1920; // 表示1920的设计图,使用100PX的默认值
    let bodyWidth = document.body.clientWidth; // 当前窗口的宽度
    if (bodyWidth < 1360) {
      bodyWidth = 1360;
    }

    let rem = bodyWidth * whdef; // 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
    document.documentElement.style.fontSize = rem + "px";
    console.log("自适应html字体大小", parseInt(rem));
    console.log("自适应缩放比列", (rem / 100).toFixed(3));
    window.$whdef = rem;
  }

  // 获取图片路径
  static getImgSrc(src) {
    if (src) {
      return http.baseUrl() + src;
    } else {
      return "/assets/img/noImg.png";
    }
  }

  static getBtn(h, options) {
    let rets = [];
    if (!options) {
      options = [options];
    }

    options.forEach(item => {
      rets.push(
        h(
          "Button",
          {
            props: {
              type: "text",
              ghost: true
            },
            style: {
              margin: "2px",
              color: "#2d8cf0"
            },
            on: {
              click: () => {
                item.click && item.click();
              }
            }
          },
          item.title
        )
      );
    });

    return h("div", { style: { margin: "5px" } }, rets);
  }

  // 下拉
  static getDropdown(h, items) {
    let btns = [];
    if (items && items.length > 0) {
      items.forEach(item => {
        btns.push(
          h(
            "DropdownItem",
            {
              on: {
                click: () => {
                  item.click && item.click();
                }
              }
            },
            item.title
          )
        );
      });
    }

    return h("Dropdown", {}, [
      h("a", {}, ["更多", h("Icon", { props: { type: "ios-arrow-down" } })]),
      h("DropdownMenu", { slot: "list" }, btns)
    ]);
  }

  // 删除确认层
  static delConfirm(callback) {
    window.rootVue.$Modal.confirm({
      title: "温馨提示",
      content: "<p>你确定删除吗？</p>",
      onOk: () => {
        callback && callback();
      }
    });
  }

  // 删除确认层
  static showConfirm(
    { title = "温馨提示", content = "内容", type = "warning" },
    callback
  ) {
    let typeMap = {
      warning: { icon: "md-alert", color: "#f90" },
      success: { icon: "md-checkmark-circle", color: "#19be6b" },
      error: { icon: "md-alert", color: "#ed4014" }
    };

    let { icon, color } = typeMap[type];
    window.rootVue.$Modal.confirm({
      render: h => {
        return h("div", { class: { pa5: true } }, [
          h("div", { class: "title flex" }, [
            h("Icon", {
              props: { type: icon },
              attrs: {
                style: `color:${color};font-size:22px;font-weight: bold;`
              }
            }),
            h(
              "h1",
              {
                class: "ml10",
                attrs: { style: "font-size:16px;font-weight: bold;" }
              },
              title
            )
          ]),
          h("div", { class: "content mt10 pa10" }, [h("p", {}, content)])
        ]);
      },
      onOk: () => {
        callback && callback();
      }
    });
  }

  static subTree(curTree, tree, callback) {
    if (curTree && curTree.length > 0) {
      curTree.forEach(p => {
        let childrenTree = tree.filter(p2 => p.id === p2.parent_id);
        if (childrenTree) {
          let subTree = uiTool.subTree(childrenTree, tree, callback);
          p.children = subTree || [];
        }
      });

      if (callback) {
        return curTree.map(p => {
          return callback(p);
        });
      }

      return curTree;
    }

    return [];
  }

  static transformTree(tree, callback) {
    let rootTree = tree.filter(p => p.parent_id === 0);
    let curTrees = uiTool.subTree(rootTree, tree, callback);
    return curTrees;
  }

  static menuToRoute(menus) {
    if (menus && menus.length > 0) {
      menus.forEach(item => {
        if (item.type === "菜单") {
          item.component = parentView;
        } else if (item.type === "页面" || item.type === "功能") {
          try {
            let componentName = item.component;
            item.component = () => import("@/view/" + componentName);
          } catch (e) {
            item.component = page404;
          }
        } else {
          item.component = parentView;
        }

        item.meta = {
          icon: item.icon,
          isMenu: item.is_show_menu,
          type: item.type
        };

        if (item.children && item.children.length > 0) {
          item.children = uiTool.menuToRoute(item.children);
        }
      });
      return menus;
    }
    return [];
  }

  static getRoutes() {
    let mainRoute = {
      path: "/",
      name: "主视图",
      redirect: "/home",
      component: Main,
      meta: { title: "首页", notCache: true },
      children: []
    };

    if (
      localStorage.authorityMenus &&
      localStorage.authorityMenus !== "undefined"
    ) {
      let authorityMenus = JSON.parse(localStorage.authorityMenus) || [];

      if (authorityMenus && authorityMenus.length > 0) {
        let menus = uiTool.transformTree(authorityMenus);
        let curRoutes = uiTool.menuToRoute(menus);

        mainRoute.children = curRoutes;
      }
    }

    return mainRoute;
  }
}
